import Taro, { Component } from '@tarojs/taro'
import { View, Text, Swiper, SwiperItem, Map, ScrollView } from '@tarojs/components'
import './index.scss'
import { AtButton, AtCalendar, AtCard, AtInputNumber, AtImagePicker, AtTabs, AtTabsPane, AtPagination, AtActivityIndicator, AtList, AtListItem, AtIcon, AtDivider, AtFloatLayout } from 'taro-ui'
import AtTabBar_index_GL from '../../components/AtTabBar_index_GL';
// 引入SDK核心类
import requets from '../../service/api';

var yiyuan_icon = require('../../assets/img/yiyuan_icon.png')
var lishi = require('../../assets/img/lishi.png')
var shangbao = require('../../assets/img/shangbao.png')


export default class Index extends Component {
  config = {
    navigationBarTitleText: '医疗废物管理助手'
  }
  state = {
    current: 0,
    current1: 0,
    userName: '',
    hospitalName: '',
    tab: [],
    tab2: [],
    dsp: '',
    ytg: '',
    yjj: '',
    hospitalId: '',

  }

  componentWillMount() { }

  componentDidMount() {



    Taro.getStorage({
      key: 'hospitalId',
      success: (res) => {
        this.setState({
          hospitalId: res.data
        }, () => {
          requets.baseOptions({
            url: `/zjn-web/zjn/collector/object/IInterface`,
            method: 'POST',
            data: { hospitalId: this.state.hospitalId }
          }).then((res) => {
            console.log(res, 33)
            if (res.data.rc === 0) {
              this.setState({
                userName: res.data.ret.collectorObject ? res.data.ret.collectorObject.contacts : '',
                hospitalName: res.data.ret.collectorObject ? res.data.ret.collectorObject.hospitalName : '',
                tab: res.data.ret.demandData,
                tab2: res.data.ret.recordData,

              })
            }
          })
        })
      }
    })


  }

  componentWillUnmount() { }

  componentDidShow() { }

  componentDidHide() { }
  handleClick(value) {
    this.setState({
      current: value
    })
  }

  handleClick1(value) {
    this.setState({
      current1: value
    })
  }

  render() {
    const { current, userName, tab, dsp, ytg, yjj, tab2, hospitalName } = this.state
    const tabList = [{ title: '今日' }, { title: '本月' }, { title: '本年' }, { title: '累计' }]

    return (
      <View className='index'>

        <AtTabBar_index_GL current={3} />
        <View className='topBox'>
          <View className='topBox_bo'>
            <View>{userName}</View>
            <View>{hospitalName}</View>
          </View>
        </View>
        <View style={{ height: '17vh' }}></View>
        <AtCard
          isFull={true}
          title='需求上报'
          thumb={shangbao}
        >
          <AtTabs current={this.state.current} tabList={tabList} onClick={this.handleClick.bind(this)}>
            {
              tab.map((item, index) => {
                return (
                  <AtTabsPane current={this.state.current} index={index} key={index}>
                    <View className='tabWarp' >
                      <View className='box' style={{ color: '#8FC31F' }}>
                        <View><Text className='title'>{item.bucketNum}</Text>个</View>
                        <View className='bottom'>收集桶数</View>
                      </View>
                      <View className='box' style={{ color: '#2CBFEF' }}>
                        <View><Text className='title'>{item.weight}</Text>kg</View>
                        <View className='bottom'>收集重量</View>
                      </View>
                    </View>
                  </AtTabsPane>
                )
              })
            }
          </AtTabs>
        </AtCard>
        <AtCard
          isFull={true}
          title='收集历史'
          thumb={lishi}
        >
          <AtTabs current={this.state.current1} tabList={tabList} onClick={this.handleClick1.bind(this)}>
            {
              tab2.map((item, index) => {
                return (
                  <AtTabsPane current={this.state.current1} index={index} key={index}>
                    <View className='tabWarp' >
                      <View className='box' style={{ color: '#8FC31F' }}>
                        <View><Text className='title'>{item.bucketNum}</Text>个</View>
                        <View className='bottom'>收集桶数</View>
                      </View>
                      <View className='box' style={{ color: '#2CBFEF' }}>
                        <View><Text className='title'>{item.weight}</Text>kg</View>
                        <View className='bottom'>收集重量</View>
                      </View>
                      <View className='box' style={{ color: '#AA89BD' }}>
                        <View><Text className='title'>{item.passingRate}</Text>%</View>
                        <View className='bottom'>审核通过率</View>
                      </View>
                    </View>
                  </AtTabsPane>
                )
              })
            }
          </AtTabs>
        </AtCard>
      </View>
    )
  }
}
